""
const layer = layui.layer
const $ = layui.$
const form = layui.form
let nameList = document.querySelector(".nameList")
let dataContent = document.querySelector(".dataContent")

function sData(mydata) {
  // data.sort(function (a, b) {
  //   return Math.random() - 0.5
  // })
  data = randomSort(mydata)
  // console.log(data)
  nameList.innerHTML = ''
  data.forEach(e => {
    nameList.innerHTML += `<li>${e}</li>`
  })
}

function shuffle(array) {
  var m = array.length,
    t, i
  while (m) {
    i = Math.floor(Math.random() * m--)
    t = array[m]
    array[m] = array[i]
    array[i] = t
  }
  return array
}


function randomSort(array) {
  let length = array.length

  if (!Array.isArray(array) || length <= 1) return

  for (let index = 0; index < length - 1; index++) {
    let randomIndex = Math.floor(Math.random() * (length - index)) + index;

    [array[index], array[randomIndex]] = [array[randomIndex], array[index]]
  }

  return array
}
sData(data)

// document.querySelector('.start').onclick = function () {
//   let x = getRandomInt(0, data.length)
//   console.log(data[x]);
//   data.splice(data.indexOf(data[x]), 1)
//   sData(data)
// }
function Ncseo(nameList, startObj, dataContent) {
  this.start = startObj[0] //开始
  this.err = startObj[1] //错误
  this.next = startObj[2] //下一题
  this.nameList = nameList //ul
  this.dataContent = dataContent //记录
  this.speed = 5 //速度
  this.liWidth = this.nameList.children[0].offsetWidth //li标签的宽度
  this.index = 0 //下标
  this.errFlag = false // 错误 按钮的节流阀
  this.nextFlag = false
  this.num = 0 //计算次数
  this.topicNum = 0 //题数
  this.writerNum = 0 //出题人被答题数
  this.totalQ = 5
}

Ncseo.prototype = {
  constructor: Ncseo,
  init() {
    this.removeWriter()
    this.bindStart()
    this.bindErr()
    this.bindNext()
  },
  removeWriter() {
    let self = this
    let index = layer.open({
      type: 1,
      title: "出题人姓名",
      content: $('#ipt'),
      area: ["300px", "200px"],
      move: false,
      anim: 4,
      closeBtn: 0
    })
    $("#nameIpt").focus()
    document.onkeyup = function (e) {
      if (e.keyCode == 13) {
        self.verifyForm.call(self, index)
      }
    }
    form.on("submit(submit)", () => {
      this.verifyForm(index)
    })
  },
  verifyForm(index) {
    let name = form.val("myIpt").name.trim()
    this.index = data.indexOf(name)
    if (this.index == -1) {
      layer.msg('未找到姓名', {
        icon: 5,
        time: 1500
      })
      form.val("myIpt", {
        name: ''
      })
      $("#nameIpt").focus()
      return
    }
    this.del()
    layer.close(index)
  },
  bindStart() {
    this.start.addEventListener("click", function () {
      this.computed()
      this.easeIn(-this.liWidth * data.length)
      this.start.style.display = 'none'
      this.err.parentNode.style.display = 'flex'
    }.bind(this))
  },
  bindErr() {
    this.err.addEventListener("click", this.errClick.bind(this))
  },
  bindNext() {
    this.next.addEventListener("click", this.nextClick.bind(this))
  },
  errClick() {
    if (this.errFlag && this.num <= 3) {
      this.errFlag = false
      this.nextFlag = this.num < 3 ? false : true
      let total = this.num * 10
      total = this.num == 3 ? 40 : total
      let sports = '抄写'
      let name = this.nameList.children[this.index].innerHTML
      // if (name == '龚新辉' || name == '王淯' || name == '李新悦') {
      //   sports = '蹲起';
      // }
      this.dataContent.innerHTML += `
          <p>${name}---第<span>${this.topicNum}</span>题--第<span
            >${this.num}</span>次---<span>${total}</span>道面试题${sports}</p>`
      this.del()
      this.nameList.style.left = 0
      if (this.num < 3) {
        this.easeIn(-this.liWidth * data.length)
      } else {
        let self = this
        setTimeout(() => {
          let index = layer.confirm('已错误3次, 请出题人讲解后,切换下一题？', {
            btn: ['我已讲解'],
            // btn: ['下一题', '不需要'],
            title: false,
            icon: 5,
            closeBtn: 0
          }, function () {
            self.nextClick()
            layer.close(index)
          })
        }, 200)
      }
    }
  },
  nextClick() {
    if (this.nextFlag) {
      // console.log(data)
      // console.log(data.length)
      this.nextFlag = false
      this.errFlag = false
      // console.log(this.topicNum)
      if (this.topicNum == this.totalQ) {
        this.num == 1 && this.writerNum++
        this.dataContent.parentNode.children[2].innerHTML = this.writerNum
        if (this.writerNum >= 2 / 3 * this.totalQ) {
          layer.alert('大多数题目被一次性答对, 题目可能没有质量，好好准备下次的分享', {
            icon: 6,
            title: false,
            closeBtn: 0
          })
        } else {
          layer.msg(`${this.totalQ}题已全部完成！`, {
            icon: 6,
            time: 200
          })
        }
        return
      }
      this.computed()
      this.del()
      if (this.topicNum == this.totalQ) {
        this.next.innerHTML = '正确'
        layer.tips('已经是最后一题了', '#next', {
          tips: [1, '#3595CC'],
          time: 10000
        })
      }
      this.nameList.style.left = 0
      this.easeIn(-this.liWidth * data.length)
    }
  },
  computed() {
    this.topicNum++
    this.num == 1 && this.writerNum++
    this.num = 0
    this.dataContent.parentNode.children[0].innerHTML = this.topicNum
    this.dataContent.parentNode.children[2].innerHTML = this.writerNum
  },
  del() {
    const el = this.nameList.children[this.index]
    data.splice(data.indexOf(el.innerHTML), 1)
    // this.nameList.removeChild(el)
    sData(data)
  },
  easeIn(target) {
    this.num++ //次数+1
    let timer = null
    clearInterval(timer)
    timer = setInterval(() => {
      $(this.nameList).animate({
        left: -$(this.nameList).children("li:first").width()
      }, 80, () => {
        $(this.nameList).css("left", 0)
        $('li').eq(0).appendTo($(this.nameList))
      })
    }, 90)
    setTimeout(() => {
      clearInterval(timer)
      this.index = getRandomInt(0, data.length)
      // console.log(this.index)
      this.easeOut(-this.liWidth * this.index)
    }, 200)
  },
  easeOut(target) {
    this.nameList.style.left = 0
    clearInterval(this.nameList.timer)
    this.nameList.timer = setInterval(() => {
      let cur = this.nameList.offsetLeft
      let step = (target - cur) / 5
      step = step > 0 ? Math.ceil(step) : Math.floor(step)
      if (cur == target) {
        this.errFlag = true
        this.nextFlag = true
        clearInterval(this.nameList.timer)
      }
      this.nameList.style.left = cur + step + 'px'
    }, 30)
  }
}
const starts = document.querySelectorAll(".start")
const ncseo = new Ncseo(nameList, starts, dataContent)
ncseo.init();

[...starts].map((item, index) => {
  item.addEventListener("mousedown", function () {
    this.style.transform = 'translate(1px, 1px)'
    document.addEventListener("mouseup", function () {
      item.style.transform = 'translate(0, 0)'
    })
  })
})

function rnd(n, m) {
  return parseInt(Math.random() * (m - n) + n)
}
function getRandomInt(min, max) {
  min = Math.ceil(min)
  max = Math.floor(max)
  return Math.floor(Math.random() * (max - min)) + min //不含最大值，含最小值
}